<template>
	<view class="container">
		<view class="top">
		
			<view class="tab">
				<view v-for="(item,index) in tabList" :class="tab==item.messageType?'title active':'title'" @tap="table(item.messageType)">
					{{item.messageName}}
					<view class="num"  v-if="item.nums!=0">{{item.nums}}</view>
				</view>
			</view>
			<view class="clear" @tap="clearInfo">
				<image class="clear-icon" src="/static/images/clearInfo.png" mode=""></image>
				<text>全部已读</text>
			</view>
		</view>
		<view class="message-box" v-if="infoList.length!=0">
			
			<view class="message-list" @tap="jump(item)" v-for="(item,index) in infoList">
				<view class="title">
					<view class="title-left">
						<view class="tit">
							{{item.title}}
						</view>
					</view>
					
					<view class="time">
						{{item.designatedPushTime}}
					</view>
				</view>

				<view class="message-con">
					<veiw class="message-img">
						<image src="/static/static/images/logo1.png" mode=""></image>
						<veiw v-if="item.status==0" class="reddot"></veiw>
						
					</veiw>
					<view class="message-txt" v-if="tab==12">
						<view :class="tab!=12?'txt':'txt color'">{{item.content}}</view>
						<view class="desc" v-if="tab==12">
							 {{item.params}}
						</view>
					
					</view>
					<view class="message-txt" v-if="tab!=12">
						<view class="desc" v-if="tab!=12">
							<view class=" userinfotab tabnickname"> 姓名：<text>{{ item.content?JSON.parse(item.content).nickname:''}}</text> </view>
							<view class=" userinfotab tabmobile"> 电话：<text>{{item.content?JSON.parse(item.content).mobile:''}}</text> </view>
							<view class="userinfotab tabshopname"> 店铺：<text>{{item.content?JSON.parse(item.content).shopName:''}}</text> </view>
						</view>
					
					</view>
				</view>
			</view>
		</view>
		<view class="infoEmpty" v-if="infoList.length==0">
			<image src="/static/images/infoEmpty.png" mode=""></image>
			<view class="infoNo">
				暂无消息
			</view>
		</view>
	
	</view>
</template>
<script>
	
	const util = require("../../utils/util.js");
	//获取应用实例
	const api = require("../../config/api.js");

	var app = getApp();

	export default {
		data() {
			return {
				// 12是订单 11  是注册
				tab: 12,
				// 页数
				page: 1,
				id: 1,
				tabList: [],
				infoList: [],
				identity:'',
			};
		},
		props:[
			
			"isDetail"
		],
		onLoad: function() {
			
			
		},
		beforeMount(){
			 this.identity = uni.getStorageSync('identity');
		},
		onReady: function() {},
		onShow: function() {
			this.getInfo();
			this.getInfoList();
		},
		onHide: function() { // 页面隐藏
		},
		onUnload: function() { // 页面关闭

		},
		onPullDownRefresh: function() {
			
		},
		onReachBottom() {
			this.page++;
			this.getInfoList(); 
		},
		methods: {
			// 全部已读
			clearInfo() {
				var _that = this;
				var data = new Object();
				
				// console.log('formData',formData);
				util.request(api.messageRead, data,'POST', '','formatDate' ).then((res) => {
					console.log(res)
					if(res.error==0){
						// 跟新消息数量
						_that.getInfo();
						_that.getInfoList();
					}
					
				});
			},
			// 切换
			
			table(index) {
				// 数据清空
				this.infoList =[];
				this.tab = index;
				
				console.log(index)
				this.page=1;
				this.getInfoList();
			},
			urlParse(url){
				let obj = {};
				let reg = /[?&][^?&]+=[^?&%]+/g;
				let arr = url.match(reg);
				arr.forEach((item) => {
				    let tempArr = item.substring(1).split('=');
				    let key = decodeURIComponent(tempArr[0]);
				    let val = decodeURIComponent(tempArr[1]);
				    obj[key] = val;
				})
				return obj;
			},
				
			jump(con) {
				var _that =this;
				// 订单详情跳转
				if (this.tab == 12) {
					console.log('con',con);
					var urlobj =  _that.urlParse(con.activityUrl);
					console.log(urlobj,'urlobj');
					var orderId = urlobj.orderId;
					if(this.identity==3){
						uni.navigateTo({
							url:"/pages/orderDetails/orderDetails?orderId="+orderId+'&isDetail='+this.isDetail
						})
					}else{
						uni.navigateTo({
							url:"/pages/orderDetails/orderDetails?orderId="+orderId
						})
					}
					var data = new Object();
					data.messageId= con.id;
					// console.log('formData',formData);
					util.request(api.messageRead, data,'POST', '','formatDate' ).then((res) => {
						console.log('消息中心',JSON.stringify(res));
						
					});
					
					// console.log('urlobj',urlobj);
					// uni.navigateTo({
					// 	url:'/pages/ucenter/orderDetail/orderDetail?id=' + con.params +'&pickupWay='+ urlobj.pickupWay  +'&total=' + urlobj.total
					// })
				}else{
					var data = new Object();
					data.messageId= con.id;
					// console.log('formData',formData);
					util.request(api.messageRead, data,'POST', '','formatDate' ).then((res) => {
						console.log('消息中心',JSON.stringify(res));
						this.getInfo();
						this.getInfoList();
					});
					
					
				}
				
			},
			// 获取维度消息
			getInfo() {
				util.request(api.messageResume, {}, ).then((res) => {
					console.log('消息中心',JSON.stringify(res));
					if (res.errno === 0) {
						this.tabList = res.data
					}
				});
			},
			// 获取消息列表
			getInfoList() {
				var _that = this;
				util.request(api.messageList+'?messageType='+this.tab+'&page='+this.page+'&size=20', {}, ).then((res) => {
					console.log('消息列表',JSON.stringify(res))
					if (res.errno === 0) {
						var data =  res.data.data;
						for(var i=0;i<data.length;i++){
							 data[i].designatedPushTime = _that.formatTimeMin(data[i].designatedPushTime);
						}
					
						// 判断page是否等于=1
						if(_that.page==1){
							this.infoList =data;
						}else{
							this.infoList = [...this.infoList, ...data];
						}
						
					}
				});
			},
			
			formatTimeMin(a) {
				var myDate = new Date(parseInt(a) );
				var datestr = "";
				datestr = myDate.getFullYear(); //获取完整的年份(4位,1970-????)
				datestr =  datestr + "-"+ ((myDate.getMonth() + 1) < 10 ? "0" + (myDate.getMonth() + 1) : (myDate.getMonth() + 1)); //获取当前月份(0-11,0代表1月
				datestr = datestr + "-" + (myDate.getDate() < 10 ? "0" + myDate.getDate() : myDate.getDate()); //获取当前日(1-31)
				datestr = datestr + " " + (myDate.getHours() < 10 ? "0" + myDate.getHours() : myDate.getHours()); //获取当前时
				datestr = datestr + ":" + (myDate.getMinutes() < 10 ? "0" + myDate.getMinutes() : myDate.getMinutes()); //获取当前分
				return datestr;
			}
			
		},
		
	};
</script>
<style>
	@import "./message.css";
</style>
